@model ZZ_ICU.Models.PatientsIndexViewModel
@{
    ViewData["Title"] = "患者面板";
}

@functions {
    // 获取患者危急程度对应的CSS类
    public string GetDangerLevelClass(string? dangerLevel)
    {
        if (string.IsNullOrEmpty(dangerLevel)) return "bg-warning text-white"; // 未显示病情用黄色代替
        
        switch (dangerLevel.Trim())
        {
            case "病情危重":
                return "bg-danger text-white"; // 病情危重 - 红色
            case "病情严重":
                return "bg-danger text-white"; // 病情严重也使用红色
            case "病情较重":
                return "bg-warning text-white"; // 病情较重使用黄色
            case "病情较轻":
                return "bg-warning text-white"; // 病情较轻使用黄色
            case "病情稳定":
                return "bg-warning text-white"; // 病情稳定 - 黄色
            case "基本痊愈":
                return "bg-success text-white"; // 基本痊愈 - 绿色
            case "死亡":
                return "bg-secondary text-white"; // 死亡 - 灰色
            default:
                return "bg-warning text-white"; // 默认使用黄色
        }
    }
}

<div class="container-fluid">
    <div class="row align-items-center bg-white border-bottom p-2">
        <div class="col">
            <!-- 整合顶部菜单到用户信息栏 -->
            <div class="d-flex justify-content-start flex-wrap gap-2">
                <div class="btn-group" role="group">
                    <button type="button" class="btn btn-sm btn-light border dropdown-toggle menu-folder" data-bs-toggle="dropdown">
                        <span class="folder-icon me-1"></span>病人管理
                    </button>
                    <ul class="dropdown-menu">
                        <li><a class="dropdown-item" href="@Url.Action("PatientInfo", "Patients")">病人基本信息浏览</a></li>
                        <li><a class="dropdown-item" href="@Url.Action("BedManagement", "Patients")">床位管理</a></li>
                    </ul>
                </div>
                <div class="btn-group" role="group">
                    <button type="button" class="btn btn-sm btn-light border dropdown-toggle menu-folder" data-bs-toggle="dropdown">
                        <span class="folder-icon me-1"></span>入科管理
                    </button>
                    <ul class="dropdown-menu">
                        <li><a class="dropdown-item" href="@Url.Action("Accept","Patients")">接收病人</a></li>
                        <li><a class="dropdown-item" href="@Url.Action("EmergencyIn","Patients")">紧急入科</a></li>
                    </ul>
                </div>
                <div class="btn-group" role="group">
                    <button type="button" class="btn btn-sm btn-light border dropdown-toggle menu-folder" data-bs-toggle="dropdown">
                        <span class="folder-icon me-1"></span>转科管理
                    </button>
                    <ul class="dropdown-menu">
                        <li><a class="dropdown-item" href="#">转科申请</a></li>
                        <li><a class="dropdown-item" href="@Url.Action("Discharge","Patients")">出科管理</a></li>
                    </ul>
                </div>
                <div class="btn-group" role="group">
                    <button type="button" class="btn btn-sm btn-light border dropdown-toggle menu-folder" data-bs-toggle="dropdown">
                        <span class="folder-icon me-1"></span>科室管理
                    </button>
                    <ul class="dropdown-menu">
                        <li><a class="dropdown-item" href="#">人员信息</a></li>
                        <li><a class="dropdown-item" href="#">病案查询</a></li>
                        <li><a class="dropdown-item" href="#">排班管理</a></li>
                        <li><a class="dropdown-item" href="#">绩效查询</a></li>
                        <li><a class="dropdown-item" href="#">护士交班</a></li>
                        <li><a class="dropdown-item" href="#">知识库</a></li>
                        <li><a class="dropdown-item" href="#">出院病例/质量控制</a></li>
                    </ul>
                </div>
                <div class="btn-group" role="group">
                    <button type="button" class="btn btn-sm btn-light border dropdown-toggle menu-folder" data-bs-toggle="dropdown">
                        <span class="folder-icon me-1"></span>科室统计
                    </button>
                    <ul class="dropdown-menu">
                        <li><a class="dropdown-item" href="#">科室统计报表</a></li>
                        <li><a class="dropdown-item" href="#">敏感指标</a></li>
                        <li><a class="dropdown-item" href="#">质控分析</a></li>
                    </ul>
                </div>
                <div class="btn-group" role="group">
                    <button type="button" class="btn btn-sm btn-light border dropdown-toggle menu-folder" data-bs-toggle="dropdown">
                        <span class="folder-icon me-1"></span>系统设置
                    </button>
                    <ul class="dropdown-menu">
                        <li><a class="dropdown-item" href="#">用户管理</a></li>
                        <li><a class="dropdown-item" href="#">权限设置</a></li>
                        <li><a class="dropdown-item" href="#">参数配置</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="col-auto d-flex align-items-center flex-wrap gap-3">
            <span>当前用户：<strong>@Model.CurrentNurseName</strong></span>
            <a class="btn btn-outline-danger" href="@Url.Action("Logout","Login")">退出</a>
        </div>
    </div>

    <!-- 隐藏的表单,用于提交患者筛选 -->
    <form method="get" id="selectPatientForm" style="display:none;">
        <input type="radio" name="mine" id="radioAll" value="false" @(Model.ShowOnlyMine ? "" : "checked") />
        <input type="radio" name="mine" id="radioMy" value="true" @(Model.ShowOnlyMine ? "checked" : "") />
        <input type="hidden" name="selectedBed" id="selectedBedInput" value="@(Model.SelectedPatient?.BedNo ?? string.Empty)" />
    </form>

    <div class="row mt-3">
        <div class="col-lg-3 mb-3">
            <div class="chart-placeholder border rounded mb-3 p-2">
                <div class="d-flex justify-content-between align-items-center mb-2">
                    <h6 class="fw-semibold mb-0">统计图</h6>
                    <button class="btn btn-sm btn-outline-secondary" type="button">刷新</button>
                </div>
                <div class="chart-canvas border rounded position-relative">
                    <span class="chart-hint">图表占位</span>
                </div>
            </div>
            <div class="border rounded p-3">
                <h6 class="fw-semibold">标签统计</h6>
                <ul class="list-unstyled small mb-0 label-stats">
                    <li class="d-flex justify-content-between"><span>24小时内入科</span><span>1</span></li>
                    <li class="d-flex justify-content-between"><span>有过敏信息</span><span>1</span></li>
                    <li class="d-flex justify-content-between"><span>有检验危急值</span><span>1</span></li>
                    <li class="d-flex justify-content-between"><span>有使用血制品</span><span>1</span></li>
                    <li class="d-flex justify-content-between"><span>使用呼吸机</span><span>1</span></li>
                    <li class="d-flex justify-content-between"><span>有注意事项</span><span>1</span></li>
                </ul>
            </div>
        </div>
        <div class="col-lg-9">
            <!-- 顶部操作按钮区：接收病人、紧急入科 -->
            <div class="d-flex justify-content-between align-items-center mb-2 p-2 bg-white border rounded">
                <div class="d-flex gap-2 flex-wrap">
                    <a class="btn btn-sm btn-outline-secondary action-btn" href="@Url.Action("Accept","Patients")">接诊</a>
                    <a class="btn btn-sm btn-outline-secondary action-btn" href="@Url.Action("EmergencyIn","Patients")">紧急入科</a>
                    <a class="btn btn-sm btn-outline-secondary action-btn" href="@Url.Action("Discharge","Patients")">出科管理</a>
                    <button type="button" class="btn btn-sm btn-outline-secondary action-btn" id="editPatientBtn">修改</button>
                    <a class="btn btn-sm btn-outline-secondary action-btn" href="@Url.Action("Orders","Patients")">医嘱</a>
                    <a class="btn btn-sm btn-outline-secondary action-btn" href="@Url.Action("LabAnalysis","Patients")">检验数据分析</a>
                </div>
                <!-- 患者筛选单选按钮 - 移到右侧 -->
                <div class="d-flex align-items-center gap-3">
                    <div class="form-check form-check-inline mb-0">
                        <input class="form-check-input" type="radio" name="mineDisplay" id="radioAllDisplay" @(Model.ShowOnlyMine ? "" : "checked") onchange="document.getElementById('radioAll').checked=true; document.getElementById('selectPatientForm').submit();" />
                        <label class="form-check-label patient-filter-label" for="radioAllDisplay" style="color: #ff4500; font-weight: 500;">全部患者 (@Model.AllPatientsCount)</label>
                    </div>
                    <div class="form-check form-check-inline mb-0">
                        <input class="form-check-input" type="radio" name="mineDisplay" id="radioMyDisplay" @(Model.ShowOnlyMine ? "checked" : "") onchange="document.getElementById('radioMy').checked=true; document.getElementById('selectPatientForm').submit();" />
                        <label class="form-check-label patient-filter-label" for="radioMyDisplay" style="color: #17b900; font-weight: 500;">我的患者 (@Model.MyPatientsCount)</label>
                    </div>
                </div>
            </div>
            
            <!-- 患者信息展示区 - 移到操作按钮下方 -->
            <div class="selected-card border rounded p-3 mb-2 bg-white">
                @if (Model.SelectedPatient is null || string.IsNullOrEmpty(Model.SelectedPatient.PatientName))
                {
                    <span class="text-muted">请选择患者查看详细信息</span>
                }
                else
                {
                    <div class="d-flex flex-wrap align-items-center gap-3">
                        <div class="d-flex align-items-baseline gap-2">
                            <span class="badge @GetDangerLevelClass(Model.SelectedPatient.DangerLevel) fs-6">@Model.SelectedPatient.DisplayBedNo</span>
                            <span class="fw-semibold">患者姓名：@Model.SelectedPatient.PatientName</span>
                        </div>
                        <div>住院号：@Model.SelectedPatient.InHosNo</div>
                        <div>入科时间：@(Model.SelectedPatient.InDateTime?.ToString("yyyy-MM-dd HH:mm") ?? "-")</div>
                        <div>主任医生：@Model.SelectedPatient.ChiefDoctor</div>
                        <div>护士：@Model.SelectedPatient.ChargeNurse</div>
                    </div>
                }
            </div>
            <div class="row g-2 p-2 bg-white border rounded">
                @foreach (var card in Model.Cards)
                {
                    <div class="col-xxl-2 col-xl-3 col-lg-3 col-md-4 col-sm-6">
                        <div class="patient-card border rounded d-flex flex-column @(Model.SelectedPatient?.BedNo == card.BedNo ? "selected" : "")" data-bed="@card.BedNo">
                            <!-- 根据患者状态动态设置顶部标签颜色 -->
                            <div class="p-2 border-bottom @GetDangerLevelClass(card.DangerLevel)">
                                <span class="fw-bold text-white">@card.DisplayBedNo</span>
                            </div>
                            <div class="p-2 card-body flex-grow-1">
                                @if (string.IsNullOrEmpty(card.PatientName))
                                {
                                    <div class="text-muted">无</div>
                                }
                                else
                                {
                                    <div class="fw-bold text-truncate">@card.PatientName</div>
                                    <div class="small text-muted mt-1">性别：@card.Sex</div>
                                    <div class="small text-muted">年龄：@(card.Age?.ToString() ?? "-") 岁</div>
                                    <div class="small text-muted">责任护士：@card.ChargeNurse</div>
                                    <div class="small text-muted">入科时间：@(card.InDate?.ToString("yyyy-MM-dd") ?? "-")</div>
                                    <div class="small text-muted">入科天数：@(card.InDays?.ToString() ?? "-")</div>
                                    <div class="small text-muted text-truncate">住院号：@card.InHosNo</div>
                                    <div class="small text-truncate">诊断：@card.Diagnosis</div>
                                }
                            </div>
                            <!-- 应用GetDangerLevelClass函数来动态设置危急程度颜色 -->
                            <div class="px-2 py-1 @GetDangerLevelClass(card.DangerLevel)" style="min-height:32px; display:flex; align-items:center; justify-content:center;">
                                <span class="small">@card.DangerLevel</span>
                            </div>
                        </div>
                    </div>
                }
            </div>
        </div>
    </div>
</div>

<!-- 移除不存在的BeginStyleContext方法调用，使用标准style标签 -->
<style>
    /* 这里是所有的CSS样式 */
    /* CSS变量定义 */
    :root {
        --primary-color: #1e88e5;
        --danger-color: #dc3545;
        --warning-color: #ffc107;
        --info-color: #17a2b8;
        --success-color: #28a745;
        --bg-primary: #ffffff;
        --bg-secondary: #f8f9fa;
        --border-color: #dee2e6;
        --text-primary: #333333;
        --text-secondary: #6c757d;
        --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
        --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
        --border-radius: 4px;
        --content-max-width: 1400px;
    }
    
    /* 全局样式 */
    body {
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
        background-color: #f5f5f5;
        color: var(--text-primary);
        line-height: 1.4;
        font-size: 14px;
    }
    
    /* 自定义样式 */
    .card-header.bg-gradient {
        background: linear-gradient(135deg, var(--primary-color), #42a5f5);
        color: white;
    }
    
    /* 按钮样式增强 */
    .btn-primary, .btn-outline-secondary {
        transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
        transform: translateY(0);
    }
    
    .btn-primary:hover, .btn-outline-secondary:hover {
        box-shadow: var(--shadow-md);
        transform: translateY(-1px);
    }
    
    .btn-primary:active, .btn-outline-secondary:active {
        transform: translateY(0);
        transition: transform 0.1s ease;
    }
    
    /* 操作按钮增强样式 */
    .action-btn {
        padding: 6px 16px;
        font-weight: 500;
        border-radius: var(--border-radius);
        margin: 0 2px;
        color: #000000; /* 文字设置为黑色 */
        font-size: 14px;
    }
    
    .action-btn:hover {
        background-color: rgba(30, 136, 229, 0.05);
        box-shadow: 0 2px 8px rgba(0,0,0,0.1);
        color: #000000; /* 悬停时保持黑色文字 */
    }
    
    /* 菜单按钮增强 */
    .menu-folder {
        transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
        font-size: 14px;
        padding: 4px 12px;
    }
    
    .menu-folder:hover {
        background-color: rgba(30, 136, 229, 0.08);
        transform: translateY(-1px);
    }
    
    /* 患者卡片样式 - 固定尺寸,防止变形 */
    .patient-card {
        min-height: 180px;
        max-height: 260px;
        width: 100%;
        cursor: pointer;
        transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
        border: 1px solid var(--border-color);
        background-color: var(--bg-primary);
        border-radius: var(--border-radius);
        box-shadow: var(--shadow-sm);
        display: flex;
        flex-direction: column;
        overflow: hidden;
        margin: 0;
        transform: translateY(0);
    }
    
    .patient-card:hover {
        border-color: var(--primary-color);
        box-shadow: var(--shadow-md);
        transform: translateY(-2px);
        z-index: 10;
    }
    
    .patient-card:active {
        transform: translateY(0);
        transition: transform 0.1s ease;
    }
    
    .patient-card.selected {
        border-color: var(--primary-color);
        box-shadow: 0 0 0 2px rgba(30, 136, 229, 0.3);
        transform: scale(1.02);
        z-index: 20;
    }
    
    /* 选中患者卡片样式 */
    .selected-card {
        border: 2px solid var(--primary-color);
        box-shadow: 0 0 0 2px rgba(30, 136, 229, 0.2);
    }
    
    /* 标签统计样式 */
    .tag-list {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    
    .tag-item {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 8px 12px;
        background-color: #f8f9fa;
        border-radius: 6px;
        transition: all 0.2s ease;
    }
    
    .tag-item.tag-highlight {
        background-color: rgba(30, 136, 229, 0.08);
        border-left: 3px solid var(--primary-color);
    }
    
    /* 警报和提示样式 */
    .alert-badge {
        display: inline-block;
        padding: 4px 10px;
        border-radius: 12px;
        font-size: 0.75rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    
    /* 关键数据突出显示 */
    .key-data {
        font-weight: 700;
        color: var(--primary-color);
    }
    
    /* 危急程度颜色定义 */
    :root {
        --danger-critical: #dc3545;
        --danger-severe: #fd7e14;
        --danger-medium: #ffc107;
        --danger-light: #17a2b8;
        --danger-stable: #fd7e14; /* 改为橙色 */
        --danger-recovered: #28a745; /* 基本痊愈 - 绿色 */
    }
    
    /* 危急程度样式 */
    .danger-level-critical {
        background-color: var(--danger-critical);
        color: white;
        padding: 6px 12px;
        font-weight: bold;
        border-radius: 4px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }
    
    .danger-level-severe {
        background-color: var(--danger-severe);
        color: white;
        padding: 6px 12px;
        font-weight: bold;
        border-radius: 4px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }
    
    .danger-level-medium {
        background-color: var(--danger-medium);
        color: #333;
        padding: 6px 12px;
        font-weight: bold;
        border-radius: 4px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }
    
    .danger-level-light {
        background-color: var(--danger-light);
        color: white;
        padding: 6px 12px;
        font-weight: bold;
        border-radius: 4px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }
    
    .danger-level-stable {
        background-color: var(--danger-stable);
        color: white;
        padding: 6px 12px;
        font-weight: bold;
        border-radius: 4px;
    }
    
    .danger-level-recovered {
        background-color: var(--danger-recovered);
        color: white;
        padding: 6px 12px;
        font-weight: bold;
        border-radius: 4px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }
    
    /* 患者卡片内部样式 - 调整内边距以更好地显示数据 */
    .patient-card .card-body {
        padding: 10px;
        line-height: 1.3;
    }
    
    /* 患者信息标签样式 */
    .patient-info-label {
        font-weight: 500;
        color: var(--text-secondary);
        margin-right: 4px;
    }
    
    .patient-info-value {
        color: var(--text-primary);
        font-weight: 500;
    }
    
    /* 空床位样式 */
    .empty-bed-card {
        opacity: 0.6;
        background-color: #f8f9fa;
    }
    
    .empty-bed-card:hover {
        opacity: 0.8;
        background-color: #e9ecef;
    }
    
    /* 容器全屏显示 */
    .container-fluid {
        max-width: 100% !important;
        padding-left: 0;
        padding-right: 0;
        margin: 0 !important;
        background-color: #f5f5f5;
    }

    /* 确保表格内容正常显示 */
    table {
        width: 100%;
        table-layout: auto;
    }

    th, td {
        word-wrap: break-word;
        white-space: normal;
    }

    /* 患者筛选标签样式 */
    .patient-filter-label {
        cursor: pointer;
        font-size: 14px;
        user-select: none;
    }

    .patient-filter-label:hover {
        opacity: 0.8;
    }

    /* 页面全屏显示 */
    body {
        overflow-x: hidden;
        overflow-y: auto;
        margin: 0;
        padding: 0;
    }

    /* 固定操作按钮行的布局 */
    .action-buttons-row {
        min-width: 100%;
    }

    /* 患者卡片网格布局 - 使用 Bootstrap 响应式列 */
    .row.g-3 {
        margin: 0;
        padding: 0 15px;
    }

    /* 左侧统计区域 */
    .col-lg-3 {
        flex: 0 0 auto;
        width: 18%;
        padding-right: 10px;
    }

    /* 右侧患者卡片区域 */
    .col-lg-9 {
        flex: 0 0 auto;
        width: 82%;
        padding-left: 5px;
    }

    /* 图表占位区域固定高度 */
    .chart-canvas {
        height: 180px;
        min-height: 180px;
    }
</style> 

<script>
    (function() {

        // 获取危急程度对应的 CSS 类
        function getDangerLevelClass(dangerLevel) {
            if (!dangerLevel) return 'bg-warning text-white';

            switch (dangerLevel.trim()) {
                case '病情危重':
                case '病情严重':
                    return 'bg-danger text-white';
                case '病情较重':
                case '病情较轻':
                case '病情稳定':
                    return 'bg-warning text-white';
                case '基本痊愈':
                    return 'bg-success text-white';
                case '死亡':
                    return 'bg-secondary text-white';
                default:
                    return 'bg-warning text-white';
            }
        }

        // 更新患者详情卡片
        function updatePatientDetailCard(patientData) {
            const selectedCard = document.querySelector('.selected-card');
            if (!selectedCard) return;

            const dangerClass = getDangerLevelClass(patientData.dangerLevel);
            const inDateTime = patientData.inDateTime ? new Date(patientData.inDateTime).toLocaleString('zh-CN', { year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit' }) : '-';

            selectedCard.innerHTML = `
                <div class="d-flex flex-wrap align-items-center gap-4">
                    <div class="d-flex align-items-baseline gap-2">
                        <span class="badge ${dangerClass} fs-6">${patientData.displayBedNo || patientData.bedNo}</span>
                        <span class="fw-semibold">患者姓名：${patientData.patientName || '-'}</span>
                    </div>
                    <div>住院号：${patientData.inHosNo || '-'}</div>
                    <div>入科时间：${inDateTime}</div>
                    <div>主任医生：${patientData.chiefDoctor || '-'}</div>
                    <div>护士：${patientData.chargeNurse || '-'}</div>
                </div>
            `;
        }

        // 优化患者卡片点击处理
        document.querySelectorAll('.patient-card').forEach(card => {
            // 添加鼠标按下效果（整个卡片）
            card.addEventListener('mousedown', () => {
                card.style.transform = 'scale(0.98)';
            });
            
            // 移除鼠标按下效果（即使鼠标移出卡片）
            card.addEventListener('mouseup', () => {
                card.style.transform = '';
            });
            
            card.addEventListener('mouseleave', () => {
                card.style.transform = '';
            });
            
            // 为卡片底部背景色区域添加双击事件
            const cardFooter = card.querySelector(':scope > div:last-child');
            if (cardFooter) {
                cardFooter.addEventListener('dblclick', (e) => {
                    e.stopPropagation(); // 阻止事件冒泡
                    const bedNo = card.getAttribute('data-bed');
                    if (bedNo) {
                        // 跳转到患者详情页面
                        window.location.href = `/Patients/PatientDetail?bedNo=${encodeURIComponent(bedNo)}`;
                    }
                });
                
                // 添加提示样式
                cardFooter.style.cursor = 'pointer';
                cardFooter.title = '双击查看患者详情';
            }
            
            // 获取卡片内容区域（避免点击上下端背景色）
            const cardContent = card.querySelector('.card-body');
            if (cardContent) {
                // 点击处理 - 只在内容区域触发，使用AJAX无刷新加载
                cardContent.addEventListener('click', async (e) => {
                    // 阻止事件冒泡
                    e.stopPropagation();
                    
                    const hidden = document.getElementById('selectedBedInput');
                    if (!hidden) return;

                    // 获取当前选中的床位和目标床位
                    const currentBed = hidden.value;
                    const targetBed = card.getAttribute('data-bed') || '';

                    // 如果点击的是已选中的卡片，则不做任何操作
                    if (currentBed === targetBed) {
                        return;
                    }

                    // 移除所有卡片的选中状态
                    document.querySelectorAll('.patient-card').forEach(c => {
                        c.classList.remove('selected');
                    });

                    // 添加选中效果
                    card.classList.add('selected');

                    // 通过 AJAX 加载患者详情
                    try {
                        const response = await fetch(`/Patients/GetPatientDetail?bedNo=${encodeURIComponent(targetBed)}`);
                        if (!response.ok) throw new Error('Failed to load patient data');

                        const result = await response.json();
                        if (result.success && result.data) {
                            // 更新隐藏字段
                            hidden.value = targetBed;

                            // 更新患者详情区域
                            updatePatientDetailCard(result.data);

                            // 更新 URL（可选，支持浏览器前进/后退）
                            window.history.replaceState(null, '', `?selectedBed=${encodeURIComponent(targetBed)}`);
                        }
                    } catch (error) {
                        // 生产环境移除错误日志
                        card.classList.remove('selected');
                    }
                });
            }
        });
        
        // 添加按钮点击优化
        document.querySelectorAll('button, .btn, a[href]').forEach(element => {
            // 忽略下拉菜单中的链接
            if (element.closest('.dropdown-menu')) return;
            
            element.addEventListener('mousedown', () => {
                element.style.transform = 'scale(0.98)';
                element.style.transition = 'transform 0.1s ease';
            });
            
            element.addEventListener('mouseup', () => {
                element.style.transform = '';
            });
            
            element.addEventListener('mouseleave', () => {
                element.style.transform = '';
            });
        });
        
        // 添加页面加载动画
        document.addEventListener('DOMContentLoaded', () => {
            const patientCards = document.querySelectorAll('.patient-card');
            patientCards.forEach((card, index) => {
                // 初始设置为透明
                card.style.opacity = '0';
                card.style.transform = 'translateY(10px)';
                
                // 错开加载时间，创造级联效果
                setTimeout(() => {
                    card.style.opacity = '1';
                    card.style.transform = '';
                    card.style.transition = 'opacity 0.4s ease, transform 0.4s ease';
                }, 50 * index);
            });
        });
        
        // 患者信息修改弹出框相关逻辑
@*         document.addEventListener('DOMContentLoaded', function() {
            // 获取修改按钮和弹出框
            const editBtn = document.getElementById('editPatientBtn');
            const modal = new bootstrap.Modal(document.getElementById('patientEditModal'));
            const selectedPatientInfo = document.querySelector('.selected-card');
            const selectedBedInput = document.getElementById('selectedBedInput');
            
            // 检查是否有选中的患者
            function hasSelectedPatient() {
                // 检查选中患者信息卡片是否有内容
                return selectedPatientInfo && 
                       !selectedPatientInfo.textContent.includes('请选择患者查看详细信息') &&
                       selectedBedInput && 
                       selectedBedInput.value.trim() !== '';
            }
            
            // 从页面提取选中患者的基本信息
            function extractSelectedPatientInfo() {
                if (!hasSelectedPatient()) return null;
                
                // 从选中患者卡片提取基本信息
                const selectedText = selectedPatientInfo.textContent;
                const patientInfo = {
                    bedNo: selectedBedInput.value,
                    // 尝试从选中患者卡片中提取其他信息
                    patientName: extractFromText(selectedText, '患者姓名：', '住院号'),
                    inHosNo: extractFromText(selectedText, '住院号：', '入科时间'),
                    inDateTime: extractFromText(selectedText, '入科时间：', '主任医生'),
                    chiefDoctor: extractFromText(selectedText, '主任医生：', '护士'),
                    chargeNurse: extractFromText(selectedText, '护士：', '')
                };
                
                return patientInfo;
            }
            
            // 辅助函数：从文本中提取信息
            function extractFromText(text, start, end) {
                const startIndex = text.indexOf(start);
                if (startIndex === -1) return '';
                
                let endIndex = text.length;
                if (end && end !== '') {
                    endIndex = text.indexOf(end, startIndex + start.length);
                    if (endIndex === -1) endIndex = text.length;
                }
                
                return text.substring(startIndex + start.length, endIndex).trim();
            }
            
            // 填充表单数据
            function populateFormWithPatientData() {
                const patientData = extractSelectedPatientInfo();
                if (!patientData) return;
                
                // 填充表单字段
                document.getElementById('patientName').value = patientData.patientName || '';
                document.getElementById('bedNo').value = patientData.bedNo || '';
                document.getElementById('inHosNo').value = patientData.inHosNo || '';
                document.getElementById('chiefPhysician').value = patientData.chiefDoctor || '';
                document.getElementById('chargeNurse').value = patientData.chargeNurse || '';
                
                // 填充入科日期
                if (patientData.inDateTime) {
                    // 尝试格式化日期时间为datetime-local格式 (YYYY-MM-DDTHH:MM)
                    const dateParts = patientData.inDateTime.split(/[- :]/);
                    if (dateParts.length >= 5) {
                        const dateTimeLocal = `${dateParts[0]}-${dateParts[1]}-${dateParts[2]}T${dateParts[3]}:${dateParts[4]}`;
                        document.getElementById('inDepartmentDate').value = dateTimeLocal;
                    }
                }
                
                // 在实际应用中，这里应该通过AJAX请求获取完整的患者信息
                // 目前我们只是从页面已有的信息填充表单
            }
            
            // 保存患者信息
            // 打印患者信息
            document.getElementById('printPatientInfo').addEventListener('click', function() {
                // 实现打印功能
                window.print();
            });
            
            // 修改按钮点击事件
            editBtn.addEventListener('click', function() {
                if (!hasSelectedPatient()) {
                    alert('请选择患者信息');
                    return;
                }
                
                // 填充表单数据
                populateFormWithPatientData();
                
                // 显示弹出框
                modal.show();
            });
        }); *@

    })();
</script>


